

import React from 'react'
// import React from 'react'
import { useSelector } from 'react-redux'


import Item from './Item'


export default function Main () {
    const list = useSelector(state => state.todo)



    return (
        <section className="main">
            <input id="toggle-all" className="toggle-all" type="checkbox" />
            <label htmlFor="toggle-all">Mark all as complete</label>
            <ul className="todo-list">
                {list.map((it) => <Item key={it.id} todo={it} />)}
            </ul>
        </section>
    )
}
